<template>
  <!-- <van-field name="uploader" label="文件上传">
    <template #input> -->
  <van-uploader v-model="fileList" :after-read="afterRead" :max-count="1" accept="image/png,image/jpeg,image/jpg"
    :max-size="20000 * 1024" @oversize="onOversize" @delete="fileDelete" />
  <!-- </template>
  </van-field> -->
</template>
<script>
import { Toast } from 'vant';
import { upload, deleteUploadFile } from '@/api/uploader.js'
import { useCounterStore } from '@/pinia/user.js'
export default {
  setup() {
    const CounterStore = useCounterStore()
    const fileList = ref([
      // {
      //   url: 'https://fastly.jsdelivr.net/npm/@vant/assets/leaf.jpeg',
      //   status: 'uploading',
      //   message: '上传中...',
      // }
    ]);

    const onOversize = (file) => {
      Toast('文件大小不能超过 20M');
    }
    const fileDelete = async (file) => {
      const res = await deleteUploadFile({ fileName: file.fileName, id: CounterStore.employeeId, type: 2, otherId: CounterStore.employeeId })
      Toast(res.message)
    }
    const afterRead = async (file) => {
      const id = CounterStore.employeeId
      file.status = 'uploading';
      file.message = '上传中...';
      const formdata = new FormData()
      formdata.append('uploadFile', file.file);
      formdata.append('employeeId', id);
      formdata.append('otherId', id);
      formdata.append('type', 2);
      const res = await upload(formdata)
      if (res.success) {
        file.status = 'done'
        file.message = '上传成功'
        file.fileName = res.message
      } else {
        file.status = 'failed'
        file.message = res.message
      }
      // file.status = 'failed';
    };

    return {
      fileList,
      afterRead,
      onOversize,
      fileDelete
    };
  },
};
</script>